<!DOCTYPE html>
<html lang="en">
<head>
    <th:block th:include="libs :: header('用户管理')"></th:block>
</head>
<body>
  <div id="UserPage">
    <ivz-basic-view ref="vbt" :metas="metas" :config="config" :search-metas="searchMetas">
        <template #status_t="params">
            <a-badge :count="params.value" :number-style="{backgroundColor: params.row.status=='正常' ? '#52c41a' : '' }"></a-badge>
        </template>
    </ivz-basic-view>
    <ivz-modal-form ref="mf" title="修改密码" :save-meta="saveMeta"
          :metas="modal.metas" :width="380" :config="{bodyStyle: {height: '180px', padding: '28px 18px 3px 3px'}}"></ivz-modal-form>
  </div>
</body>
<th:block th:include="libs :: footer"></th:block>
<script>
    let status = [
        {value: '正常', label: '正常'},
        {value: '禁用', label: '禁用'},
    ];
    let sex = [
        {label: '男', value: '男'},
        {label: '女', value: '女'},
        {label: '未知', value: '未知'},
    ]
  let vue = new Vue({
      el: "#UserPage",
      data: {
          metas: [
              {field: 'base', title: '基础信息', metas: [
                      {field: 'name', title: '用户名称', required: true},
                      {field: 'account', title: '登录账号', required: true},
                      {field: 'orgId', title: '所属部门', type: 'stree'
                          , url: '/core/org/view'},
                      {field: 'sex', title: '性别', width: 70, type: 'radio', data: sex},
                      {field: 'phone', title: '手机号'},
                      {field: 'email', title: '邮箱', width: 160, type: 'email'},
                      {field: 'status', title: '状态', clear: true, width:70
                          , type: 'select', data: status, default: '正常', required: true},
                      {field: 'remark', title: '备注', width: 220},
                      {field: 'createTime', title: '创建时间', type: 'date', width: 160, isForm: false},
                  ]},
              {field: 'role', title: '用户角色 (超级管理员不可用)', metas: [
                      {field: 'roleIds', title: '角色列表', type: 'checkbox', isTable: false
                          , span: [2, 21, 24], url: '/core/role/list', disabled: function (model) {
                              return model['superUser'];
                          }}
                  ]},
              {field: 'action', title: '操作', type: 'action', width: 220, fixed: 'right'}
          ],
          searchMetas: [
              {field: 'name', title: '用户名称', clear: true},
              {field: 'phone', title: '手机号', clear: true},
              {field: 'status', title: '状态', type: 'select', data: status, clear: true},
          ],
          modal: {
              metas: [
                  {field: 'password', title: '密码', type: 'password', required: true, span: [8, 14, 24]},
                  {field: 'surePassword', title: '确认密码', type: 'password'
                      , required: true, span: [8, 14, 24], validator: function(rule, value, call) {
                          let editModel = vue.$refs['mf'].$basicForm.getEditModel();
                          if(editModel['password'] === editModel['surePassword']) {
                              call()
                          } else {
                              if(!editModel['surePassword']) call()
                              else call(new Error("密码不一致"))
                          }
                      }},
              ],
          },
          saveMeta: {},
          actionMetas: null,
          config: {
              form: {
                  editSource: 'remote' // 声明编辑的数据来自于远程服务器
              },
              table: {
                  pagination: {}
              }
          },
      },
      created: function() {
          let _this = this;
          this.$page.setActionMeta("Del", {disabled: function (row) {
                  return row['superUser']
              }});
          this.$page.setActionMeta("Pwd", {callBack: function(model) {
                  return new Promise(function(resolve, reject) {
                      _this.$refs['mf'].open({password: null, surePassword: null, id: model['id']});
                  })
              }});
          let pwdMeta = this.$page.getActionMetas()['Pwd'];
          if(pwdMeta) {
              this.saveMeta['url'] = pwdMeta['url']
              this.saveMeta.callBack = function(model) {
                  return new Promise(function(resolve, reject) {
                      return resolve();
                  })
              };
          }
      },
      methods: {

      }
  });
</script>
</html>
